<template>
  <view class="logistics-page">
    <view class="process" v-if="processList.length > 0">
      <u-steps
        dot
        :current="0"
        direction="column"
        activeColor="#FF4254"
        inactiveColor="#B7BDC6"
        activeIcon="checkmark-circle-fill"
        inactiveIcon="checkmark-circle"
      >
        <u-steps-item
          v-for="(item, index) in processList"
          :title="item.acceptStation"
          :desc="item.acceptTime"
          :key="index"
        ></u-steps-item>
      </u-steps>
    </view>
    <Empty v-else />
  </view>
</template>

<script>
import Steps from "@/components/steps/index.vue";
import orderApi from "@/api/order";

export default {
  name: "returnDetails",
  components: {
    Steps,
  },
  data() {
    return {
      active: 0,
      processList: [],
    };
  },
  onLoad(options) {
    this.id = options.id;
    this.getOrderLogistics();
  },
  onShow() {},
  methods: {
    getOrderLogistics() {
      let data = {
        orderId: this.id,
        // orderId: "S241229115437127",
      };
      orderApi.getOrderLogistics(data).then((res) => {
        if (res.code == 200) {
          this.processList = res.rows;
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.logistics-page {
  width: 100vw;
  height: 100vh;
  overflow-y: auto;

  .process {
    width: 694rpx;
    border-radius: 24rpx;
    background: #fff;
    margin: 20rpx 28rpx 20rpx 28rpx;
    padding: 32rpx 20rpx;
  }
}
</style>
